<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>签核系统-驳回详情</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="renderer" content="webkit" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0" />
    <link rel="icon" href="/febs/images/favicon.ico" type="image/x-icon" />
    <!-- <link rel="stylesheet" href="/febs/vue/element-ui-index.css"> -->
    <link rel="stylesheet" href="/febs/vue/vxe-table-style.css" />
    <script src="/febs/vue/vue.js"></script>
    <script src="/febs/vue/axios.min.js"></script>
    <!-- <script src="/febs/vue/element-ui-index.js"></script> -->
    <script src="/febs/vue/xe-utils.js"></script>
    <script src="/febs/vue/vxe-table.js"></script>
    <!--  <script src="/febs/vue/jquery.js"></script>-->
  </head>
  <body>
    <div id="app" class="layui-fluid w-app">
      <vxe-table max-height="420px" border show-header-overflow highlight-hover-row resizable :align="allAlign" :data="tableData">
        <vxe-table-column type="seq" title="序号" width="50"></vxe-table-column>
        <vxe-table-column field="billstdNm" title="单据类别" min-width="120"></vxe-table-column>
        <vxe-table-column field="orderNo" title="单据编号" min-width="160"></vxe-table-column>
        <vxe-table-column field="sendUserCname" min-width="120" title="送签人员"></vxe-table-column>
        <vxe-table-column field="toUserCname" min-width="120" title="签核人员"></vxe-table-column>
        <vxe-table-column field="checkRole" title="签核角色" min-width="100"></vxe-table-column>
        <vxe-table-column field="content" min-width="250" title="驳回原因"></vxe-table-column>
        <vxe-table-column field="createDate" title="驳回日期" min-width="120"></vxe-table-column>
      </vxe-table>
    </div>
  </body>
  <script>
    new Vue({
      el: "#app",
      data() {
        return {
          allAlign: null,
          tableData: [],
          classifyList: [],
        };
      },
      created() {
        //获取类别列表
        // axios
        //   .get("/classify/getList")
        //   .then((res) => {
        //     this.classifyList = res.data.data.rows;
        //   })
        //   .catch((error) => {
        //     console.log(error);
        //   });
        // //获取驳回列表
        // axios
        //   .get("/reject/getList", {
        //     params: JSON.parse(sessionStorage.parameterDataRejectDetail),
        //   })
        //   .then((response) => {
        //     //把单据类别改为中文后渲染
        //     response.data.data.forEach((res) => {
        //       console.log(this.classifyList)
        //       res.billstdNm = this.classifyList.find((aws) => {
        //         return (aws.billstdNo === res.classify);
        //       })?.billstdNm;
        //     });
        //     //数据渲染
        //     this.tableData = response.data.data;
        //   })
        //   .catch((error) => {
        //     console.log(error);
        //   });
        const tasks = [
          axios.get("/baseflow/getList"),
          axios.get("/reject/getList", {
            params: JSON.parse(sessionStorage.parameterDataRejectDetail),
          })
        ]
        Promise.all(tasks).then(results => {
          const [result1, result2] = results
          const rows = result1.data.data || [];
          const {data: list = []} = result2.data;
          const typeMap = {};
          rows.forEach(item => {
            typeMap[item.billstdNo] = item.billstdNm;
          });
          list.forEach(item => {
            item.billstdNm = typeMap[item.classify]
          })
          this.tableData = list
        });
      },
      methods: {},
    });
  </script>

  <style>
    .w-app {
      display: flex;
      flex-direction: column;
      justify-content: center;
      text-align: center;
      font-size: 14px;
      padding: 0px 15px 15px 15px;
      background: #ffffff !important;
    }
    .text-center {
      text-align: center;
    }
    .text-left {
      text-align: left;
    }
    th,
    td {
      padding: 4px 4px;
    }
    .main-table,
    .main-table th,
    .main-table td {
      border-collapse: collapse;
      border: 1px solid #000;
    }
    .total > td {
      padding: 6px 4px;
    }
    .horizontal-sign {
      margin-top: 30px;
    }
    .sign {
      border-bottom: 1px solid #000;
      width: 200px;
    }
    .text-16px {
      font-size: 16px;
    }
  </style>
</html>
